<template>
  <el-table :data="quest_options" border>
    <el-table-column prop="code" label="判断题" width="1000px" :reserve-selection="true">
      <template slot-scope="scope">
        <el-checkbox-group v-model="scope.row.is_true">
          <el-checkbox
            :label="scope.row.code"
            value="true"
            @change="handleAChecked(scope.row.code)"
          />
        </el-checkbox-group>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  name: "JudgeChoose",
  data() {
    return {
      arr: ["正确", "错误"],
      quest_options: [],
      quest_answer: ""
    };
  },
  created() {
    this.quest_options.push(
      { code: this.arr[0], content: "", is_true: false },
      { code: this.arr[1], content: "", is_true: false }
    );
  },
  methods: {
    handleAChecked(code) {
      const res = this.quest_options.filter(item => item.code !== code);
      res.forEach(item => {
        item.is_true = false;
      });
      const res1 = this.quest_options.filter(item => item.code === code);
      res1.forEach(item => {
        this.quest_answer = item.code;
      });
      this.$emit("getQuest_options", this.quest_options, this.quest_answer);
    }
  }
};
</script>

<style lang='scss' scoped>
.el-table {
  width: 1000px;
}
</style>
